/**
 * @class app.InfoDetail
 * @namespace app
 * @extends Ext.Panel
 */
app.InfoDetail = function(configObj) {
    var thisObject = this;
    var topBar = new Ext.Toolbar({
        dock: 'top',
        title: 'Info',
        items: [{
            text: 'Back',
            ui: 'back',
            handler: function() {
					app.eventMgr.fireEvent('BacktoMain', null);
				}
        }]
    });

    app.InfoDetail.superclass.constructor.call(this, {
        dockedItems: [ topBar ],
        layout: 'card',
		scroll: 'vertical',
		styleHtmlContent: true,
    	html: 'Loading...'
		});

    function infoDetail() {
		  thisObject.update({
            'html': ["<h5><b>About GlocalChinese</b></h5>"+
				"<p>GlocalChinese is an exclusive App for the Chinese communities of London.</p>"+
				"<p>Looking for a nice Chinese restaurant around you? Show them on map? View their ratings? and even share them to facebook? GlocalChinese is the right App for you.</p>"+
				"<p>For suggestion or support, please contact <a href=\"mailto: info@glocalchinese.com\">info@glocalchinese.com</a></p>"+
				"<p>Version: GlocalChinese 1.0<br />Powered by: Episy Ltd.</p>"+
				"<p><i>Copyright: The GlocalChinese service is operated and made available by Episty.</i></p>"]
        });
        app.page.setActiveItem(2,{ type: 'slide', reveal: true, 'direction': 'up' });
    }

    app.eventMgr.on('InfoDetail', infoDetail);
};
Ext.extend(app.InfoDetail, Ext.Panel, {});